javascript - 有没有办法避免 axios 中的 linkpreview.net 出现 CORS 错误，就像 Angular 中的 trustAsResourceUrl() 一样？

Question

我正在尝试实现 linkpreview.net我的reactJS应用程序中使用axios的API，但它给了我以下CORS错误

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://api.linkpreview.net/?callback=JSON_CALLBACK&q=abc.xyz&key='my key here'. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

这是我的 axios 代码

axios({
          method:'post',
          url:"http://api.linkpreview.net/?callback=JSON_CALLBACK&q="+res+"&key="+UserSetting.fetchUrlKey,
          headers: {'Access-Control-Allow-Origin': '*'},
          data: data
      })
      .then(response => {
        console.log(response);

      })
      .catch((error) => {
        console.log(error);
      })

如果我做错了什么，请告诉我!!

Answer 1

出于某种原因，Axios 不会提供对 jsonp 请求的支持，这里提到:https://github.com/mzabriskie/axios/pull/15

此外，他还使用 npm 包 jsonp 为 jsonp 提供了另一个配方

所以，你可以尝试一下并使用类似的东西:

var j = require('jsonp');

j('http://api.linkpreview.net/?key=123456&q=https://www.google.com', function (err, data) {
  if (err) {
    console.error(err.message);
  } else {
    console.log(data);
  }
});