How to solve the problem that browsers intercept Alipay pop-up windows? To be compatible with safari

problem description

browser intercepts window.open () method

the environmental background of the problems and what methods you have tried

use to open a pop-up window first, and then change the address. Is still being intercepted.

related codes

/ / Please paste the code text below (do not replace the code with pictures)

const newWin = window.open();
     debugger
      let alipayURL = this.payURL;
      this.$axios.get(alipayURL, {
        params:{
          orderId: this.alipayOrderId,   //Id
        }
      }).then(
        (res) => {
          if(res.data.status == 200){
            //
             let routerData = this.$router.resolve({path:"/alipay",query:{htmls:res.data.data.page_html}});
             newWin.location.replace = routerData.href;
          }else{
            this.$message({
              message: "",
              type: "warning"
            });
          }
        }
      )

what result do you expect? What is the error message actually seen?

what should I do?

Mar.02,2022

should not invoke the relevant code until the user interaction has been generated.
for example, make a full-screen div and call it after the click on the event. Otherwise, it will be blocked by the browser as a junk web page.


create a new blank pop-up window first. Then change the address of the blank pop-up window.

clipboard.png
Note: there is no time difference between the button you click and the window you open. Some browsers allow a time difference. It won't be intercepted.


try async

Menu