मैं खोज विज्ञापनों का उपयोग करना चाहता हूं।

तो जब घटक ने स्क्रिप्ट को माउंट किया, और जब यह अनमाउंट होगा तो उन्हें हटा दें

लेकिन मैं पेज के मुद्दे को बदलने के साथ संघर्ष कर रहा हूँ

पृष्ठ बदलने से मेरे संबद्ध विज्ञापन नहीं दिखते, लेकिन वापसी त्रुटि (getBoundcingClientRect) getBoundingClientRect

जब मैं पेज को रीफ्रेश करता हूं तो मैं अपने विज्ञापन देख सकता हूं।

मैंने इस पोस्ट को देखा Amazon Affiliate search ad script: ध्यान में न आया लेखन त्रुटि: नल की संपत्ति 'getBoundingClientRect' नहीं पढ़ सकता

लेकिन मैं अपनी परियोजना में पोस्टस्क्राइब का उपयोग नहीं कर सका, एक निर्भरता मुद्दा है

यहाँ मेरी प्रतिक्रिया घटक कोड है:

import React, { Component } from 'react';
import { connect }          from 'react-redux';
import { getLocale }        from '../../selectors/session';

function mapStateToProps (state, { concerts }) {
  return {
    artist: state.artist.artist,
    locale: getLocale(state),
  };
}

@connect(mapStateToProps)
export default class AffiliateContainer extends Component {
  componentDidMount () {
    this.appendScript()
  }

  componentWillUnmount() {
    this.removeScript()
  }

  appendScript(){
    const script = document.createElement('script')
    script.type = 'text/javascript'
    script.src = `//z-na.amazon-adsystem.com/widgets/onejs?MarketPlace=US`
    script.id = 'amazon-affiliate'
    script.async = true
    const s = document.createElement('script')
    s.type = 'text/javascript'
    s.id = 'amazon-affiliate2'
    s.async = true
    const code = `amzn_assoc_placement = "adunit0"; amzn_assoc_tracking_id = "trackingID"; amzn_assoc_search_bar = "false"; amzn_assoc_ad_mode = "search"; amzn_assoc_ad_type = "smart"; amzn_assoc_marketplace = "amazon"; amzn_assoc_region = "US"; amzn_assoc_default_search_phrase = "kpop, ${this.props.artist?.groups?.length > 0 ? `${this.props.artist.name}, ${this.props.artist.groups[0].name}` : this.props.artist.name}"; amzn_assoc_default_category = "All"; amzn_assoc_linkid = "linkID"; amzn_assoc_title = "Shop Related Products";`
    s.appendChild(document.createTextNode(code))

    const dom = document.getElementById('amazon-search-container')
    const ad = document.getElementsByClassName('amzn-native-container')

    if(dom && !ad.length > 0) {
      dom.appendChild(s)
      dom.appendChild(script)
    }
  }

  removeScript(){
    const dom = document.getElementById('amazon-search-container')
    const script1 = document.getElementById('amazon-affiliate')
    const script2 = document.getElementById('amazon-affiliate2')
    if(dom){
      dom.removeChild(script1)
      dom.removeChild(script2)
    }
  }

  render() {
    return (
      <div className="contents-wrap">
        <div id="amazon-search-container">
          <div id="amzn_assoc_ad_div_adunit0_0"/>
        </div>
      </div>
    );
  }
}
1
wang kwang Lee 13 फरवरी 2020, 08:28

1 उत्तर

मुझे पता चला कि इसने amzn_assoc_ad_div_adunit0_0 को पहले और अगले adunit0_1, adunit0_2, इत्यादि में रेंडर किया है।

यहाँ मुझे अमेज़न वेबपेज पर मिला है यहां छवि विवरण दर्ज करें

एक div_name पैरामीटर है, इसलिए मैंने amzn_assoc_div_name = "amzn_assoc_ad_div_adunit0_0" जोड़ा और यह ठीक से काम करता है

2
wang kwang Lee 13 फरवरी 2020, 08:28