wordpress - Wordpress API 的 React 前端 - 添加 content.rendered 只允许安全来源

Question

正如前言，我正在使用 create-react-app 样板。

我正在尝试将来自 wordpress API 的帖子解析为一个 react 组件，以便我可以提取所有图像并使它们成为自己的 JSX 对象。我需要让每个帖子都有自己的点击方法，所以我不能只使用 React 中的 dangerouslyaddHTML 函数。

目前，我从每个帖子的 WP 内容中搜索具有呈现 HTML 的 json 字符串，并找到所有 img 标签。然后我将图像 src 添加到一个数组并将其设置为我的状态。

但是我收到了这个错误:

DOMException:只允许安全来源

我目前托管的网站 http://natalie.madeline-omoore.com/build/

我的部分组件的代码如下:

`componentDidMount(){
var owner;
for(var i = 0; i < this.props.categoryId.length; i++) {
    if (this.props.categoryId[i].num === this.props.content.categories[0]) {
        owner = this.props.categoryId[i].category;
        this.setState({
          catname: owner
        })
        break;
    }        
}
var theContent = this.props.content.content.rendered;

var output = $(theContent).find("img").map(function() {
  return this.src;

}).get();



this.setState({
  postImages: output
});

   }
  click(){
    this.updateActive();
    this.props.fix();
  }


 render() {
if (this.props.className === this.state.catname) {
   return (
    <div >
      { this.props.className === this.state.catname && 
        <article className={`${this.state.catname}`} >
             {this.state.postImages.map((image, i) => 
                <ImageContain key={image} image={image} fix={this.props.fix} />
             )}

      </article>
     } 
   </div>
  );
 } else {
    return null;
 }

}`

我是新手所以谢谢你!

Answer 1

这听起来像是 create-react-app 默认的“service worker”的问题

您可以通过将以下内容添加到 index.js 来注销工作人员:

import { unregister } from './registerServiceWorker';

// ...

unregister();

一定要在调用 registerServiceWorker() 之后调用 unregister()。

您可以在此处了解更多相关信息:https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#making-a-progressive-web-app

祝你好运，编码愉快!