如何使用JavaScript存储网页/网页中的数据？_Javascript_Json_Angular

如何使用JavaScript存储网页/网页中的数据？

javascript json angular

如何使用JavaScript存储网页/网页中的数据？,javascript,json,angular,Javascript,Json,Angular,我希望使用JavaScript以JSON格式本地存储此页面。我已经查找了脚本和代码片段，但是我找不到任何有用的东西，因为每次运行代码时都会出现相同的错误 Access to XMLHttpRequest at 'https://public.tableau.com/en-us/s/gallery/feed' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight requ

我希望使用JavaScript以JSON格式本地存储此页面。我已经查找了脚本和代码片段，但是我找不到任何有用的东西，因为每次运行代码时都会出现相同的错误

Access to XMLHttpRequest at 'https://public.tableau.com/en-us/s/gallery/feed' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

下面是我目前使用的代码

  $.ajax({

     url:"https://public.tableau.com/en-us/s/gallery/feed",
     method: 'GET',
     dataType:'JSON',
     headers: {
         'Access-Control-Allow-Origin': '*'
     },
     success: function(response) {
         console.log(response);
     }
});

我也试过用邮递员。它还提供了无法获得任何响应的错误。是因为Tableau网站的限制还是我做错了什么

PS：我正试图在Angular 7项目中实现这一点。

除非响应中提供了

访问控制允许原点

，否则您将无法从浏览器上的其他域执行此操作。我建议改为设置一个后端端点（可能通过NodeJS），它调用这个端点而不是前端，然后从代码中调用该端点。在后端，您将不会遇到

Access Control Allow Origin

错误，这就是我建议您将其作为代理的原因

如果您决定使用NodeJS作为后端，可以执行以下操作：

运行

npm安装--save express

为节点安装express（节点服务器框架）

创建如下结构：

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script src="http://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
        crossorigin="anonymous"></script>
    <script>
        $.ajax({
            url: "/api/tableau-gallery-feed",
            method: 'GET',
            success: function (response) {
                console.log(response);
            }
        });
    </script>
</body>
</html>

然后运行

node index.js

启动服务器

转到localhost:8888查看您的页面，如果您检查控制台，则应记录数据。

您可以分享一个相同的示例。您是否使用NodeJS作为后端@Bhartendu？我已经安装了node和npm，但我不会将其用于除安装和依赖项之外的任何其他用途。您无法直接执行此操作从JS客户端，您需要构建服务器端（如@Talha提到的节点）实用程序，该实用程序将接受URL数据并将结果发送回angular 7应用程序。此外，我不确定这一点，但如果没有任何效果，我也可以考虑删除数据。如果您将使用node作为后端，那么（Cheerio）将是一个很大的帮助。@Bhartendu我刚刚用一个非常简单的node Express服务器示例更新了答案。服务器需要启用CORS才能使所述代码正常工作。我相信他们还没有这样做。另外，在angular 7项目中使用

$.ajax

也不是一个好主意。你可能想考虑做一个可以为你服务的服务：这可能对你有帮助。

var express = require('express')
var https = require('https')
var app = express()

app.use(express.static('public'))

app.get('/api/tableau-gallery-feed', function (req, res) {
    https.get('https://public.tableau.com/en-us/s/gallery/feed', function (data) {
        data.setEncoding('utf8')
        let rawData = ''
        data.on('data', function (chunk) {
            rawData += chunk
        })
        data.on('end', function () {
            res.end(rawData)
        });
    })
})

app.listen(8888, () => console.log('Server started.'))