Implementation of wechat web page subscription message

There are two ways to do this ：

One ： Wechat open label

The expression is component embedded page , Official account one-time subscription message | Wechat open documents Wechat Developer Platform documentation https://developers.weixin.qq.com/doc/offiaccount/Message_Management/One-time_subscription_info.html

  This implementation is explained in detail in another blog post WeChat official account subscription message wx-open-subscribe Implementation and pit closure guide _a_ Jing's blog -CSDN Blog Wechat subscription message avoidance guide and solution , And implementation example code https://a-jing.blog.csdn.net/article/details/125484670

Two ： Official account one-time subscription message （ Service number subscription notification function ）

The expression is that the front end redirects to the authorization page of wechat and then returns to the page ,

Catalog | Wechat open documents Wechat Developer Platform documentation https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html#23

  This implementation is simple , Is to splice the parameters , Then jump to the address , As shown below ：

	location.href =
			`https://mp.weixin.qq.com/mp/subscribemsg?action=get_confirm&appid=${appId}&scene=${scene_id}&template_id=${template_id}&redirect_url=${redirect_url}#wechat_redirect`;

After the jump, you will return to the page before the jump , Receive on page options.action === 'confirm' When , User authorization .

The following is the official document description ：

First step ： User consent authorization is required , Get an opportunity to push a subscription template message to users

On the premise of ensuring that wechat public account has the authority to subscribe to message authorization （ The certified official account has the authority , You can log in to the public platform and view it in the interface permission list ）, Guide users to open the following link on wechat client ：

https://mp.weixin.qq.com/mp/subscribemsg?action=get_confirm&appid=wxaba38c7f163da69b&scene=1000&template_id=1uDxHNXwYQfBmXOfPJcjAS3FynHArD8aWMEFNRGSbCc&redirect_url=http%3a%2f%2fsupport.qq.com&reserved=test#wechat_redirect

Parameter description

Parameters	Whether must	explain
action	yes	Directly fill in get_confirm that will do
appid	yes	The only sign of official account number
scene	yes	Reset to bring back scene Parameters , Developers can fill in 0-10000 The integer value of , Used to identify subscription scenario values
template_id	yes	Subscribe to message templates ID, Log in to the background of public platform , You can view the subscription template in the interface permission list ID
redirect_url	yes	Callback address redirected after authorization , Please use UrlEncode Handling links . notes ： requirement redirect_url The domain name of should be consistent with the registered business domain name , And the business domain name cannot take path . The business domain name needs to log in to the official account , Set up - Setting of public number - In the function settings, the business domain name is set .
reserved	no	Used to maintain the status of requests and callbacks , Please take it back to the third party after authorization . This parameter can be used to prevent csrf attack （ Cross Station Request Forgery Attack ）, It is recommended that the third party bring this parameter , Can be set as simple random number plus session check , Developers can fill in a-zA-Z0-9 Parameter values for , most 128 byte , Ask to do urlencode
#wechat_redirect	yes	Whether you open it directly or make a page 302 When redirecting , This parameter is required

Relevant information will be returned after the user agrees or cancels the authorization

If the user clicks agree or cancel authorization , Page will jump to ：

redirect_url/?openid=OPENID&template_id=TEMPLATE_ID&action=ACTION&scene=SCENE

Parameter description

Parameters	explain
openid	User unique identification , Only when the user confirms the authorization
template_id	Subscribe to message templates ID
action	User click action ,"confirm" Confirm authorization on behalf of the user ,"cancel" Cancel authorization on behalf of the user
scene	Subscription scenario value
reserved	The request is carried in and returned as is